﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="/Style/JS/Aries.Loader.js"></script>

</head>
<body>
    <pre>
         GitHub 开源：<a href="https://github.com/cyq1162/Aries"  target="_blank">https://github.com/cyq1162/Aries</a>  作者：<a href="http://www.cnblogs.com/cyq1162"  
             target="_blank">路过秋天</a> ：<a href="https://www.cnblogs.com/cyq1162/category/828163.html"  target="_blank">更多教程</a>
        
</pre>
    <hr />
    <div title="我要把工具条放这里面来" id="dg_toolbar" style="display: none;">
        我要把工具条放这里面来.....
    </div>
    <div style="height: 400px;">
        <div id="dg"></div>
    </div>

    <div id="dg_search" style="display: none;" title="我要把查询区放这里面来" class="page-form">
        <div class="line">
            <div class="short">
                <label>自定义F1：</label><input type="text" class="easyui-validatebox easyui-numberbox" validtype="length[1,11]" name="F1">
            </div>
            <div class="short">
                <label>自定义F2：</label><input type="text" configkey="是否" defaultitem="false" name="F2">
            </div>
        </div>
    </div>

    <!-- <input type="number" />
    <input type="range" min="0" max="100" step="5" value="5" onchange="display.value=value" id="r" />
    <output id="display" onload="value=111"></output>
    <progress max="100" min="0" value="30" step="5" id="pr" onchange="pro.value='AAF'"></progress><output id="pro">AF</output>
    <datalist id="lst">
        <option value="a">A</option>
        <option value="b">B</option>
        <option value="c">C</option>
    </datalist>
    <input list="lst" /><br />
    <textarea spellcheck="false"></textarea>-->
</body>
</html>
<script type="text/javascript">
    // alert(JSON.stringify(AR.Global.GetUser()));
    var customToolbar = AR.Utility.queryString('toolbar');
    var grid = new AR.DataGrid('V_Test', 'Demo_TestA');

    //自定义工具栏
    if (customToolbar) {
        grid.Search.$target = $('#dg_search');
        grid.ToolBar.$target = $('#dg_toolbar');
    }
    //grid.options = {
    //    //fit:false,
    //    queryParams: { "a": 1 },
    //    onLoadSuccess: function () {
    //       // grid.ToolBar.$target.appendTo("#toolbar");
    //       // alert('options.onLoadSuccess');
    //        //grid.datagrid("freezeRow", 1);
    //        //grid.datagrid("freezeRow", 2);

    //    },
    //    onBeforeLoad: function () {

    //       // alert('onBeforeLoad');
    //    }
    //}
    grid.Search.BtnQuery.onBeforeExecute = function (data) {
        // alert('BtnQuery.onBeforeExecute');
    }
    // grid.isShowToolArea = false;
    //grid.ToolBar.isHidden = true;
    //grid.Search.isHidden = true;
    //grid.Search.$target.find('[name="F1"]').val('test');  

    //自定义按钮-图片上传示例--------------------------------开始--------------------------------------
    grid.ToolBar.add('自定义按钮-图片上传', null, 10, 'btn-lg', "edit", "btnUpload");
    grid.ToolBar.add('自定义按钮-图片上传2', "upload", 10, 'btn-lg', "edit", "btnUpload2");
    var opts = {};
    opts.action = '/ajax.html';//提交的地址
    opts.data = { "test": "aaa" };//提交的参数
    opts.onSubmit = function (file, ext) {
        alert("扩展名检测为：" + ext);
    }
    opts.onComplete = function (file, data) {
        alert("返回的数据：" + data);
    }
    grid.ToolBar.onAfterExecute = function () {
        if (customToolbar) { return; }
        var $btnUpload = this.Items["btnUpload"].$target;
        // var $btnUpload2 = this.Items["btnUpload2"].$target;
        new AR.Upload($btnUpload, opts);//为按钮增加上传事件
        //  new AR.Upload($btnUpload2, opts);//为按钮增加上传事件
    }
    function upload(btn, dgid) {
        new AR.Upload(btn, opts);//为按钮增加上传事件
        alert("表格ID：" + dgid + " 再点一次上传图片");

    }
    //自定义按钮-图片上传示例---------------------------------结束-------------------------------------

    grid.PKColumn.add('edit', '编辑', null, 'edit.html', '编辑Test表');
    grid.PKColumn.add('del');

    grid.PKColumn.add('abc', "hello", null, "aaa.html?uid={ID}", "hello world!");//{XXX}的值会被对应的字段值替换（注意大小写）。

    //表格内-图片上传示例--------------------------------开始--------------------------------------
    grid.PKColumn.add('detail', '表格内-图片上传示例', "fn", null, null, "edit");

    grid.PKColumn.onBeforeExecute = function (v, r, i, btns) {
        //btns[0].isHidden = true;
        //return v + "bd";

    };

    grid.PKColumn.onAfterExecute = function (v, r, i, s) {
        var $btnUpload2 = this.Items[i]["detail"].$target;//这里存档的对象的引用，(本方法执行时，节点还没被加载到table中)
        $btnUpload2.attr("name", "btnUpload");//提前设置好参数。
    };
    grid.options.onLoadSuccess = function () {
        var items = document.getElementsByName("btnUpload");
        for (var i = 0; i < items.length; i++) {
            items[i].setAttribute("title", "b");
            new AR.Upload(items[i], opts);//为按钮增加上传事件
        }
    }
    //表格内-图片上传示例--------------------------------结束--------------------------------------
    //grid.options.defaultWhere = [
    //    { name: 'F1', pattern: 'like', value: '1' },
    //    { name: 'F3', pattern: 'like', value: '3' }
    //];
    grid.addWhere("f3", "3", "like");
    // grid.removeWhere("f1");
    //grid.addWhere("f1>2", "id>3 or id<2", "likeor");
    grid.Search.onAfterExecute = function () {
        if (!customToolbar && this.Items.length > 0) {
            //  this.Items["f1"] && this.Items["f1"].$target.val('1');
        }
        // this.Items['F2'].$target.val(1);
        //this.Items['F3'].$target.val('2016-07-08');
        //this.Items['F4'].$target.val('400000000');
    }
    //grid.Search.BtnQuery.onBeforeExecute = function (data)
    //{
    //    data.push({ name: 'F2', pattern: 'like', value: '2' });
    //}
    //grid.ToolBar.BtnAdd.winUrl = "http://aries.cyqdata.com"; 
    //grid.ToolBar.BtnAdd.winTitle = "官网示例";
    grid.bind();
    function F7(v, r, i) {
        return "f7:" + v;
    }
    function F8(v, r, i) {
        return "f8:" + v;
    }
    function fn() {
        alert('fn');
        return false;//return false 才能阻碍后续的窗口打开事件。
        AR.Utility.Window.showMsg('TEST');
    }
    function styleFormatter() {
        return 'background-color:#ffee00;color:red;';
    }
    function imgFormatter(value, row, index) {
        return "<img src='" + value + "\' />";
    }


    //创建一个隐藏的上传按钮
    //var $btnUpload = $('<input type="button"  value="upload" style="width:200;height:200" />');
    //$('body').append($btnUpload);
    //var opts = {};
    //opts.action = '/ajax.html';
    //opts.onSubmit = function () { }
    //new AR.Upload($btnUpload, opts);//为按钮增加上传事件

    //function uploadImg(value, row, index)
    //{
    //    alert($btnUpload);
    //    $btnUpload.click();
    //}
    /* 导入前追加一些Post参数 */
    grid.ToolBar.BtnImport.onBeforeExecute = function (para) {
        alert("导入的参数：" + JSON.stringify(para));
        para.Name = "追加一个名字，Excel导入配置的格式化可以配置@Name";
        para.Para2 = "随意了...";
    }
</script>

